<template>
	<view>

		<view class="hotelService">
			<view class="title">
				<text class="name">酒店服务协议增项</text><text class="name" style="color: red;">(付给酒店钱)</text>
			</view>
			<view class="content">
				<view class="box">
					<view class="">
						<text style="color: red;"></text>
						<text>LED屏数量</text>
					</view>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.led_amount" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<view class="">
						<text style="color: red;"></text>
						<text>LED屏价格</text>
					</view>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.led" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>				
				<commonPicker leftTitle="仪式" :disabled="isEdit" @echoValue="echoValueFn"     :rightValueId="hotelProtocol.ritual_id"   name="ritualPicker"></commonPicker>				
				<view class="box">
					<text>仪式价格</text>
					<input type="digit" :disabled="isEdit"  v-model="hotelProtocol.ritual" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>

				<view class="box">
					<text>婚房数量</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.wedding_room_amount" placeholder="请输入"
					 placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>婚房价格</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.wedding_room" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>停车位数量</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.part_amount" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>停车位价格</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.part" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>香槟数量</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.champagne_amount" placeholder="请输入"
					 placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>香槟价格</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.champagne" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>茶歇数量</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.tea_amount" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>茶歇价格</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.tea" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>蛋糕数量</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.cake_amount" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>蛋糕价格</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.cake" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>进场费</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.celebration_admission_fee" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<text>其他费用</text>
					<input type="digit" :disabled="isEdit" v-model="hotelProtocol.other_fee" placeholder="请输入" placeholder-style="color:#999999;" />
				</view>
				<view class="box">
					<view class="">
						<text style="color: red;">*</text>
						<text>付款总计金额</text>
					</view>
					<input type="digit" :disabled="isEdit" v-model="pay_hotel_totals" placeholder="请输入"
					 placeholder-style="color:#999999;" />
				</view>
			</view>
		</view>


	</view>
</template>

<script>
	import sun from '@/utils/sun.js'
	export default {
		components: {

		},
		props:{
			isEdit:{
				type:Boolean,
				default:false
			},
			dataValue:{
				type:Object||Array
			}
		},
		data() {
			return {			
				hotelProtocol: {
					wedding_room_amount: 0, //婚房数量
					wedding_room: 0, //婚房价格
					part_amount: 0, //停车数量
					part: 0, //停车价格
					champagne_amount: 0, //香槟数量
					champagne: 0, //香槟价格
					tea_amount: 0, //茶歇数量
					tea: 0, //茶歇价格
					cake_amount: 0, //蛋糕数量
					cake: 0, //蛋糕价格					
					pay_hotel_totals: 0,			         
					led: 0, //led
					led_amount: 0, //led_amount屏幕
					ritual: 0, //仪式价格
					ritual_id: 0, //仪式名称
					celebration_admission_fee:0,//进场费
					other_fee:0,//其他费用
				}, //酒店协议
			}
		},
		computed:{
			'pay_hotel_totals'(){
				let _this=this
				let pay_hotel_totals = parseFloat(this.hotelProtocol.led)+ parseFloat(this.hotelProtocol.wedding_room)+parseFloat(this.hotelProtocol.part)+parseFloat(this.hotelProtocol.champagne)+parseFloat(this.hotelProtocol.tea)+parseFloat(this.hotelProtocol.cake)+parseFloat(this.hotelProtocol.ritual) + parseFloat(this.hotelProtocol.celebration_admission_fee)+ parseFloat(this.hotelProtocol.other_fee)
				_this.hotelProtocol.pay_hotel_totals = pay_hotel_totals
				return _this.hotelProtocol.pay_hotel_totals
			}
		},
		onLoad(options) {
         
		},
		watch:{		
			hotelProtocol:{
				handler:function(newValue,oldValue){				  
				  this.$emit('echoHotelProtocol',newValue)
				},
				deep:true,
			},
			dataValue:{
				handler:function(newValue,oldValue){				  			
				  this.hotelProtocol =  newValue				    
				},
				deep:true,
			}
		
		},
		methods: {
            echoValueFn(e){			
			    this.hotelProtocol.ritual_id = e.id
			},
		}
	}
</script>

<style lang="less">
	@import '@/pages/auditless';
</style>
